<!DOCTYPE html>
<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/common/common.jspf"%>
<%@ include file="/common/taglibs.jspf"%>
<html lang="en">
  <head>
	</head>
	<body> 			
		<!-- quick filter -->
		<div>			
			<ul class="nav nav-pills">	
        <li <c:if test="${empty param.filter }">class="active"</c:if> >
			    <a href="my.do"><s:message code="userMessage.filter.unread" /></a>
			  </li>			  
			  <li <c:if test="${'read' eq param.filter }">class="active"</c:if> ><a href="my.do?filter=read"><s:message code="userMessage.filter.read" /></a></li>
			</ul>
		</div>		
		<!-- data-list -->
		<div ng-controller="UserMessageCtrl">			
      <table class="table table-striped table-hover table-condensed table-bordered ng-clock">
        <tbody>
          <tr ng-repeat="userMessage in unreadMessages">
            <td>
              <span class="badge badge-info">{{userMessage.i18n.moduleName}}</span> {{userMessage.content}}
              <div class="pull-right action-buttons">         
                <span class="text-muted">{{userMessage.createDatetime|date: 'yyyy-MM-dd HH:mm:ss' }}</span>        
                <a href="javascript:;" class="blue" ng-click="readMessage(userMessage.id, $index)">
                  <i class="icon-check"></i>
                </a>
                <a href="javascript:;" class="red" ng-click="deleteMessage(userMessage.id, $index)">
                  <i class="icon-trash"></i>
                </a>          
              </div>            
            </td>
          </tr>
        </tbody>
      </table>
		</div>
    <!-- angularjs -->
    <script type="text/javascript" src="${contextPath }/theme/default/js/angular.js"></script>     
		<!--page specific plugin scripts-->				
		<script type="text/javascript">
		$(document).ready(function(){			
			initAngularjs();
		});	
		
		function UserMessageCtrl($scope, $http, $filter) {      
      $scope.unreadMessages = [];      
      
      $http.post("${contextPath}/message/userMessage/getUnreadMessages.json").success(function(data) {
        $scope.unreadMessages = data.unreadMessages;
      });
      
      $scope.readMessage = function(id, index) {
        $http.post("${contextPath}/message/userMessage/read.json", {"id": id}).success(function(data) {
          
        });
      }
      
      $scope.deleteMessage = function(id, index) {
        $http.post("${contextPath}/message/userMessage/delete.json", {"id": id}).success(function(data) {
          $scope.unreadMessages.splice(index, 1);
        });
      }
		}  
		</script>			
	</body>
</html>
